<!DOCTYPE html>
<html>
<head>
    <title>user form</title>
    <#include "/header.html">
    <style>
        .layui-upload-img {
            max-height: 100px;
        }
    </style>
</head>
<body class="bg-white">

<div id="appMain">
    <form class="layui-form layuimini-form" action="" lay-filter="dataForm">
        <div class="layui-form-item">
            <label class="layui-form-label">商家姓名</label>
            <div class="layui-input-block">
                <input type="text" name="name" class="layui-input layui-disabled" disabled>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">身份证</label>
            <div class="layui-input-block">
                <input type="text" name="idCard" class="layui-input layui-disabled" disabled>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">联系电话</label>
            <div class="layui-input-block">
                <input type="text" name="phone" class="layui-input layui-disabled" disabled>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">认证状态</label>
            <div class="layui-input-block">
                <input type="radio" id="inc0" name="authStatus" value="2" title="认证通过">
                <input type="radio" id="inc1" checked name="authStatus" value="3" title="认证驳回">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">身份证正面</label>
            <div class="layui-input-block">
                <div class="layui-upload">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="cardFront" src="${request.contextPath}/statics/images/avatar.png">
                        <p id="uploadText"></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">身份证正面</label>
            <div class="layui-input-block">
                <div class="layui-upload">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="cardBack" src="${request.contextPath}/statics/images/avatar.png">
                        <p id="uploadText"></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手持身份证</label>
            <div class="layui-input-block">
                <div class="layui-upload">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="cardHands" src="${request.contextPath}/statics/images/avatar.png">
                        <p id="uploadText"></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">营业执照</label>
            <div class="layui-input-block">
                <div class="layui-upload">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="businessLicence" src="${request.contextPath}/statics/images/avatar.png">
                        <p id="uploadText"></p>
                    </div>
                </div>
            </div>
        </div>
        <!-- 点击图片放大 -->
        <img alt="" style="display:none;" id="displayImg" src="" height="700" width="700"/>
        <div class="layui-form-item layui-hide">
            <div class="layui-input-block">
                <button type="button" class="layui-btn layui-btn-normal" id="commitBtn" lay-submit lay-filter="saveBtn">确认保存</button>
            </div>
        </div>
    </form>
</div>

<script type="text/javascript">
    layui.use(['form'], function () {
        var form = layui.form,
            $ = layui.$;
        var _parent = parent;
        if (_parent.formDataId > 0) {
            $.ajax({
                type: "POST",
                url: serverUrl('user/extra/info/' + _parent.formDataId),
                data: {},
                dataType: "json",
                success: function (result) {
                    if (result.code === 0) {
                        form.val('dataForm', result.info);
                        if(result.authstatus==2){
                            $("#inc1").removeAttr("checked");
                            $("#inc0").attr("checked","checked");
                            form.render();
                        } 
                        if (result.info.cardFront != '') {
                            $('#cardFront').attr('src', result.info.cardFront);
                            $('#cardBack').attr('src', result.info.cardBack);
                            $('#cardHands').attr('src', result.info.cardHands);
                            $('#businessLicence').attr('src', result.info.businessLicence);
                        }
                    }
                }
            });
        }

        //监听提交
        form.on('submit(saveBtn)', function (data) {
            var params = data.field;
            params['id'] = _parent.formDataId
            params['authStatus'] = data.field.authStatus;
            submitFormData('user/extra/verify', params);
            return false;
        });
        $(".layui-upload-img").click(function(){
            var url = $(this).attr('src');
            $("#displayImg").attr("src", url);
            var height = $("#displayImg").height();
            var width = $("#displayImg").width();
            layer.open({
               type: 1,
               title: false,
               closeBtn: 0,//隐藏关闭按钮
               shade: [0.3, '#000'],//黑色背景（0.3代表颜色深度）
               shadeClose: true,//点击遮罩关闭大图
               area: [width + 'px', height + 'px'], //宽高
               resize:false,//不可拖拽缩放
               skin: 'myskin',//大图背景色定义类
               content: "<img alt=" + name + " title=" + name + " src=" + url + " height=700px; width=700px;" + "/>"
            });
        })
    });
</script>
</body>
</html>